<template>
  <div class="entirety">
    <span @click="goToHome">我的电商网站</span>
    <span @click="goToShoopingCar">购物车</span>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();

function goToShoopingCar() {
  // router.push({
  //   name: "ShoopingCar",
  // });
  router.push({ path: "/cart" });
}
function goToHome() {
  router.push({ name: "list" });
}
</script>

<style  scoped>
.entirety {
  width: 100%;
  height: 48px;
  line-height: 40px;
  background-color: rgba(0, 0, 0, 0.8);
  color: white;
  font-size: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
span {
  margin: 0 80px;
}
</style>